<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
	<meta name="viewport" content="user-scalable=no,viewport-fit=cover" />
	<link href="./css/baseCss.css" rel="stylesheet" type="text/css"/>
	<link href="./base/layer.css" rel="stylesheet" type="text/css"/>
	<!-- <link href="./base/articlecon.css" rel="stylesheet" type="text/css"/> -->
	<link href="./base/base2.css" rel="stylesheet" type="text/css"/>
	<link rel="stylesheet" type="text/css" href="./css/swiper-3.4.0.min.css">
	<script type="text/javascript" src="./base/rem.js"></script>
	<script type="text/javascript" src="./base/iscroll.js"></script>

	<style type="text/css">
		body{
			background-color: #f5f5f5;
		}
		section{
			padding: 0rem 0.5rem;
		}
		/*订单详情头部*/
		.headerList{
			width: 0.6rem;
    		margin-top: -0.05rem;
		}
		/*订单详情*/
		.orderTop{

		}
		.orderEve{
    		overflow: auto;
    		display: flex;
    		margin-bottom: 0.5rem;
		}
		.orderEve:nth-last-of-type(1){
			margin: 0;
		}
		.orderEve_img{
			width: 2.5rem;
    		height: 2.5rem;
    		overflow: hidden;
		}
		.orderEve_text{
			padding-left: 0.5rem;
		}
		.orderEve_textT{
			color: #676767;
   			font-size: 0.4rem;
    		margin-top: 0.35rem;
		}
		.orderEve_textS{
			font-size: 0.35rem;
		}
		.orderEve_money{
			font-weight: 600;
    		line-height: 2.5rem;
    		padding-left: 0.5rem;
		}
		.orderInc{
			border-radius: 0.1rem;
    		overflow: hidden;
    		margin-top: 0.4rem;
    		background-color: #fff;
    		padding: 0.6rem 0.3rem;
		}

		.dinNum{
			font-weight: 600;
			margin-left: 2rem;
		}
		.qrcode{
			text-align: center;
    		width: 7rem;
    		height: 7rem;
    		margin: 0 auto;
    		margin-top: 0.4rem;
		}
		.qrcodeInc{
			margin-bottom: 2.5rem;
		}
	</style>
	<title>订单详情</title>
</head>
<body>
	<div>
		<header class="allHeader">
			<div class="headerReturn" onclick="disOrder();"><img class="imgBai" src="./img/nav_bake.png"></div>
			<span>订单详情</span>
			<div class="headerList"><img class="imgBai" src="./img/dot_03.png"></div>
		</header>
		
		<section>
			<div class="orderInc">
				<span>取餐号</span><span class="dinNum">C1089</span>
			</div>
			<div class="orderInc">
				<div>取餐二维码</div>
				<div class="qrcode"><img class="imgBai" src="./img/neet_02.png"></div>
			</div>
			<div class="orderInc qrcodeInc">
				<ul id="orderList" class="orderTop">
					<li class="orderEve">
						<div class="orderEve_img"><img class="imgBai" src="./img/neet_02.png"></div>
               			<div class="orderEve_text">
               			    <div>扬州炒饭</div>
               			    <div class="orderEve_textT">订单编号:&nbsp&nbsp111</div>
               			    <div class="orderEve_textT">下单时间:&nbsp&nbsp<span class="orderEve_textS">2018-01-01&nbsp&nbsp20:00:00</span></div>
               			</div>
               			<div class="orderEve_money">￥27</div>
					</li>
				</ul>
			</div>
			
		</section>
		<footer>
			<div class="home">
				<div class="home-every" onclick="window.location.href='./index.html'">
					<div><img src="./img/home_03.png"></div>
					<div class="home-text">首页</div>
				</div>
				<div class="home-every" onclick="window.location.href='./order.html'">
					<div><img src="./img/home_05.png"></div>
					<div class="home-text" style="color: #fc6264;">订单</div>
				</div>
				<div class="home-every" onclick="window.location.href='./myCenter.html'">
					<div><img src="./img/home_04.png"></div>
					<div class="home-text">我的</div>
				</div>
			</div>
		</footer>
	</div>
	
</body>

<script type="text/javascript" src="./js/jquery.min.js"></script>
<script type="text/javascript" src="./js/constants.js"></script>
<script type="text/javascript" src="./js/httpUnit.js"></script>
<script type="text/javascript">
findFoodOrderDetail();

function findFoodOrderDetail() {
    var Request = GetRequest();
    var id = Request['id'];
    var obj = JSON.stringify({
        "id": id
    });

    httpHelperpost(_API_FOOD_ORDER_DETAIL, obj, function (isSuccess, data) {
        if (isSuccess == true) {
            var response = data.responseText;
            var value = JSON.parse(response);

            // console.log(response);
            
            if (value.code == 0) {
                console.log("查询成功");
                var html = "";
                var fl = "";
                for(var i=0,len=value.data.foodList.length;i<len;i++){
                	fl = value.data.foodList[i];
                	html+="<li class='orderEve'>"
							+"<div class='orderEve_img'><img class='imgBai' src='./img/neet_02.png'></div>"
               				+"<div class='orderEve_text'>"
               				    +"<div>"+fl.name+"</div>"
               				    +"<div class='orderEve_textT'>订单编号:<br>"+value.data.orderNumber+"</div>"
               				    // +"<div class='orderEve_textT'>下单时间:<br>&nbsp&nbsp<span class='orderEve_textS'>"+allDateTime(value.data.deliveryProgress[0].progressTime)+"</span></div>"
               				+"</div>"
               				+"<div class='orderEve_money'>￥"+fl.price*fl.buyNum+"</div>"
						+"</li>";
                }
                $("#orderList").html(html);
            } else if (value.code == 401) {
                alert(value.message);
                window.location.href = './index.html';
            } else {
                alert(value.message);
                console.log("查询失败");
            }
        } else {
        }
    });
}

//获取url中"?"符后的字串
function GetRequest() {
    var url = location.search; //获取url中"?"符后的字串

    var theRequest = new Object();
    if (url.indexOf("?") != -1) {
        var str = url.substr(1);

        strs = str.split("&");

        for (var i = 0; i < strs.length; i++) {

            theRequest[strs[i].split("=")[0]] = strs[i].split("=")[1];
        }
    }
    return theRequest;
}

//统一修改日期格式
function allDateTime(date){
	date = new Date(date);	//此处可转换所有日期格式
	var year = date.getFullYear();
	var month = date.getMonth()+1;
	var day = date.getDay();
	if(month<10){
		month="0"+month;
	}
	if(day<10){
		day="0"+day;
	}
	var hour = date.getHours();
	var minute = date.getMinutes();
	var second = date.getSeconds();
	return year+"-"+month+"-"+day+"&nbsp&nbsp"+hour+":"+minute+":"+second;
}
</script>
</html>